<template>
  <div class="content">
    <div v-if="getLB != ''">
      <div class="TX_TOP">
        <div style="display: flex; margin-left: 20px">
          <van-image
            class="imgTX"
            :src="require('../static/ry.png')"
            mode=""
          ></van-image>
          <div
            style="
              display: flex;
              align-items: center;
              justify-content: space-between;
            "
          >
            <div
              style="display: flex; flex-direction: column; line-height: 25px"
            >
              <div style="color: #0f0505; font-size: 15px">{{ name }}</div>
              <div style="color: #0f0505; font-size: 12px">{{ mobile }}</div>
            </div>
          </div>
        </div>
        <div style="margin-left: auto; margin-right: 20px; display: flex"></div>
      </div>
      <div class="tabList">
        <div v-for="item in tabList" class="tabList_item" @click="TZ(item)">
          <van-icon :name="item.icon" :color="item.color" size="28"></van-icon>
          <div>{{ item.name }}</div>
        </div>
      </div>
      <div class="XXlist">
        <van-cell-group :border="false">
          <!-- <van-cell
            :icon="require('../static/My/qb.png')"
            :isLink="true"
            title="钱包"
            @click="QB"
          ></van-cell> -->
          <van-cell
            :icon="require('../static/My/jkda.png')"
            :isLink="true"
            title="健康档案"
            @click="CKxx"
          ></van-cell>
          <van-cell
            @click="CKxx"
            :icon="require('../static/My/M.png')"
            title="健康二维码"
            :isLink="true"
          ></van-cell>
          <van-cell
            :icon="require('../static/My/grxx.png')"
            @click="jumpToEditSelf"
            :isLink="true"
            title="个人信息"
          ></van-cell>
          <van-cell
            @click="LXKF('13264629723')"
            :icon="require('../static/My/lxkf.png')"
            title="联系客服"
            value="13264629723"
            :isLink="true"
          ></van-cell>
          <van-cell
            v-if="admin == 'admin'"
            @click="QHxx"
            :icon="require('../static/My/GLY.png')"
            title="切换管理员"
            :isLink="true"
          ></van-cell>
        </van-cell-group>
      </div>
    </div>
    <div v-else></div>
    <van-popup mode="center" :show="popupshow" round>
      <div class="xxfrom">
        <van-form @submit="Onsubmit">
          <van-cell-group inset>
            <van-field
              v-model="modelXX.name"
              name="value"
              label="用户姓名"
              placeholder="绑定编码"
              :rules="[{ required: true, message: '请填写用户姓名' }]"
            />
            <van-field
              v-model="modelXX.uid"
              label="手机号"
              placeholder="请输入手机号"
              :rules="[{ required: true, message: '请填写手机号' }]"
            />
            <van-field name="stepper" label="年纪">
              <template #input>
                <van-stepper v-model="age" />
              </template>
            </van-field>
            <van-field name="radio" label="性别">
              <template #input>
                <van-radio-group v-model="sex" direction="horizontal">
                  <van-radio
                    :customStyle="{ marginRight: '16px' }"
                    v-for="(item, index) in radiolist1"
                    :name="item.value"
                    :key="index"
                  >
                    {{ item.name }}
                  </van-radio>
                </van-radio-group>
              </template>
            </van-field>
          </van-cell-group>
          <div class="marginTop15">
            <van-button round block type="primary" native-type="submit">
              提交
            </van-button>
          </div>
        </van-form>
      </div>
      <!-- <div style="padding: 20px; box-sizing: border-box"> -->

      <!-- <van-form
          labelPosition="left"
          :model="modelXX"
          ref="form1"
          labelWidth="70px"
        >
          <van-form label="性别" prop="sex" borderBottom ref="item2">
            <van-radio-group v-model="sex">
              <van-radio
                :customStyle="{ marginRight: '16px' }"
                v-for="(item, index) in radiolist1"
                :key="index"
                :label="item.name"
                :name="item.name"
              >
              </van-radio>
            </van-radio-group>
          </van-form>
          <van-form label="年纪" borderBottom>
            <van-field
              type="number"
              inputWidth="100px"
              v-model="age"
            ></van-field>
          </van-form>
        </van-form>
        <van-button
          @click="submit"
          style="margin-top: 10px"
          type="primary"
          text="确定"
        ></van-button> -->
      <!-- </div> -->
    </van-popup>
    <van-dialog title="二维码已生成" :show="imgshow" @confirm="imgshow = false">
      <div style="text-align: center">
        <van-image width="150px" height="150px" :src="JKimg"></van-image>
      </div>
    </van-dialog>
    <van-dialog
      @cancel="show = false"
      @confirm="QRZC"
      :showCancelButton="true"
      :show="show"
      :title="'提示'"
    >
      <div class="padding10">是否生成（未生成用户无法查看健康档案）</div>
    </van-dialog>
  </div>
</template>

<script>
import { updateUserVersions } from "@/api/realAssets/icsharedstation/manager.js";
import { selectUser } from "@/api/realAssets/icsharedstation/home.js";
import {
  updateQRCode,
  userQRCode,
} from "@/api/realAssets/icsharedstation/JBJJ_JKZC_GXGJ_SHFS/index.js";
import { getpersonalInformation, setpersonalInformation } from "../common/RYXX";
import { Toast } from "vant";

export default {
  name: "MY",
  data() {
    return {
      JKimg: "",
      imgshow: false,
      sex: "1",
      age: 28,
      show: false,
      popupshow: false,
      admin: "",
      name: JSON.parse(getpersonalInformation()).userName,
      getLB: "111",
      mobile: "",
      radioList: [
        {
          name: "女性",
          value: "0",
          disabled: false,
        },
        {
          name: "男性",
          value: "1",
          disabled: false,
        },
      ],
      modelXX: {
        uid: "",
        name: "",
        sex: "男性", //男/女
        age: 28, //年龄
        ishid: "", //
      },
      tabList: [
        {
          name: "全部订单",
          icon: "orders-o",
          color: "#010202",
          badge: 10,
          state: "",
        },
        {
          name: "待使用",
          icon: "clock-o",
          color: "#010202",
          badge: 10,
          state: "0",
        },
        {
          name: "待审核",
          icon: "question-o",
          color: "#010202",
          badge: 10,
          state: "2",
        },
        {
          name: "已取消",
          icon: "close",
          color: "#010202",
          badge: 10,
          state: "-1",
        },
        {
          name: "已完成",
          icon: "passed",
          color: "#010202",
          badge: 10,
          state: "1",
        },
      ],
    };
  },
  methods: {
    CKxx() {
      Toast({
        message: "功能开发中",
        icon: "warning-o",
      });
      return;
    },
    QRZC() {
      this.show = false;
      this.popupshow = true;
      //默认获取手机号
      selectUser({
        ishid: localStorage.getItem("androidCode"), //拿到编码
      }).then((resXX) => {
        this.modelXX.uid = resXX.data.mobile;
        this.modelXX.name = resXX.data.userName;
        this.modelXX.ishid = localStorage.getItem("androidCode");
      });
    },
    Onsubmit() {
      if (this.sex == "男性") {
        this.modelXX.sex = "1";
      } else {
        this.modelXX.sex = "0";
      }
      this.modelXX.age = this.age + "";
      updateQRCode(this.modelXX).then((res) => {
        if (res.data) {
          this.popupshow = false;
          this.imgshow = true;
          this.JKimg = res.data;
        }
      });
    },
    QB() {
      Toast({
        message: "功能开发中",
        icon: "warning-o",
      });
      // Notify({ type: "warning", message: "功能开发中" });
      return;
    },
    //切换管理员
    QHxx() {
      updateUserVersions({
        versions: "admin",
        ishid: JSON.parse(getpersonalInformation()).ishid,
      }).then((res) => {
        //切换成功后更改用户状态
        setpersonalInformation(res.data); //本地存储默认人员信息
        this.$router.push("icsharedstation_AdminPages_Adminindex");
      });
    },
    // 跳转到订单列表
    TZ(item) {
      this.$router.push({
        name: "rvicsharedstation-DD_index",
        query: {
          XX: item.state, // 序列化对象
        },
      });
      // router.push({
      //   name: "i_life_dd_index",
      //   query: {
      //     XX: item.state // 序列化对象
      //   }
      // })
    },
    jumpToEditSelf() {
      this.$router.push({
        name: "rvicsharedstation-My_GRXQ",
      });
    },
    JKDR() {
      Toast({
        message: "功能开发中",
        icon: "warning-o",
      });
      return;
      // router.push("/JKZC/JKFX")
      // uni.navigateTo({
      // 	url: '/pages/pagesNew/JKZC/JKFX'
      // })
    },
    // 联系客服
    LXKF(text) {
      // uni.setClipboardData({
      //   data: text,
      //   success: function () {
      //     Toast.success("复制成功");
      //   },
      // });
    },
  },
  mounted() {
    if (JSON.parse(getpersonalInformation()).mobile) {
      this.mobile = JSON.parse(getpersonalInformation()).mobile;
      this.admin = JSON.parse(getpersonalInformation()).admin;
    }
  },
};
</script>
<style lang="less" scoped>
.titleXX {
  position: relative;
  padding: 10px;
  padding-top: 40px;
  background: #fff;
  // margin-top: 20rpx;

  .title_WZ {
    position: absolute;
    left: 50%;
    top: 22px;
    transform: translate(-50%, 0px);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 5px;
  }
}

.TX_TOP {
  position: absolute;
  // top: 100rpx;
  // left: 40rpx;
  height: 160px;
  display: flex;
  align-items: center;
  width: 100%;
  background-color: #fff;

  .imgTX {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    margin-right: 10px;
  }
}
.xxfrom {
  width: 300px;
  padding: 10px;
}
.content {
  height: calc(100vh - 50px);
  width: 100%;
  background: url("../static/Homeimg/SYBJ1.png") no-repeat;
  background-size: 100% 100%;
  position: relative;

  .XXlist {
    padding: 10px;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: calc(100vh - 305px);
    background: #fff;
    // border-radius: 80rpx 80rpx 0 0;
  }
}

.tabList {
  background: #fff;
  border-radius: 5px;
  width: 100%;
  position: absolute;
  top: 170px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 20px;

  .tabList_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 10px 0;
    font-size: 12px;

    div {
      margin-top: 10px;
    }
  }
}
</style>
